<style>
#tumbnails_frame {
background: #FFF;
min-height: 204px;
max-height: 204px;
width: 375px;
height: 204px;
overflow: auto;
border: 1px solid #000;
}
#disclaimer_content {
	width: 343px;
	background: #ffffff;
}
</style>
{foreach $hotelArray as $hotel}
    <input id="picture_number{$hotel.id}"type="hidden" value="{$hotel.nrOfPictures}" />
    <div id="hotel-division">
        <div id="hotel-ribbon-offers" class="hidden border-on" >
            <img src="" />
            <span>Promotion:</span>
            <span id="hotel-text">Discount 30 % -- Book now !&nbsp;&nbsp;&nbsp;</span>
        </div>
        <div id="hotel-data" class="border-on marginless" >
            <img class="thumbnailImage inline-block left" src="{$hotel.thumbnailUrl}" />
            <div id="hotel-content" class="inline-block right">
                <span id="hotel-name-price">
                    <h3 class="left">{$hotel.hotelName} </h3>

                    <h3 class="right" id="price_text">Avg rate: {intval(($hotel.lRate+$hotel.hRate)/2)} {$hotel.rateCurrencyCode}

                    </h3>

                </span>
                <span id="hotel-short-desc" >
                    {$hotel.shortDesc|unescape:"htmlall"}
                </span>
            </div>
            <span id="" class=""></span>
            <span id="" class=""></span>
            <span id="" class=""></span>


        </div>


        <div id="hotel_tabs">

            <div>

                <table cellspacing="0" id="tabs_table">
                    <tr>
                        <td class="hotel_details_tab" id="hotel_details_tab{$hotel.id}" onmouseover="a_hover(1,{$hotel.id})"  onmouseout="a_mouseout(1,{$hotel.id})" onclick="a_click(1,{$hotel.id})">
                            <input type="hidden" id="tb_hotel_hidden{$hotel.id}" value="0" />
                            <label class="hotels_tb" id="hotels_tb{$hotel.id}"  onmouseover="a_hover(1,{$hotel.id})" onmouseout="a_mouseout(1,{$hotel.id})"  >Hotels Details  </label>
                        </td>
                        
                        <td class="room_details_tab" id="room_details_tab{$hotel.id}" onclick="a_click(2,{$hotel.id})">
                            <input type="hidden" id="tb_room_hidden{$hotel.id}" value="0" />
                            <label class="room_tb" id="room_tb{$hotel.id}">Check Availability  </label>
                        </td>
                        
<!--                    <td class="room_details_tab" id="room_details_tab{$hotel.id}" onmouseover="a_hover(2,{$hotel.id})" onclick="a_click(2,{$hotel.id})" onmouseout="a_mouseout(2,{$hotel.id})">
                            <input type="hidden" id="tb_room_hidden{$hotel.id}" value="0" />
                            <label class="room_tb" id="room_tb{$hotel.id}" onmouseover="a_hover(2,{$hotel.id})" onmouseout="a_mouseout(2,{$hotel.id})" >Check Availability  </label>
                        </td>-->
                        
                        <td class="galery_tab" id="galery_tab{$hotel.id}" onmouseover="a_hover(3,{$hotel.id})" onclick="a_click(3,{$hotel.id});show_picture(0,{$hotel.id})" onmouseout="a_mouseout(3,{$hotel.id})">
                            <input type="hidden" id="tb_galery_hidden{$hotel.id}" value="0" />
                            <label class="galery_tb" id="galery_tb{$hotel.id}" onmouseover="a_hover(3,{$hotel.id})" onmouseout="a_mouseout(3,{$hotel.id})">Galery </label>
                        </td>
                        
                        <td>

                        </td>
                        <td width="200px">

                        </td>


                        <td class="hotel_options">
                            Star Rating <img id="star_rating" src="./images/rating/star1.png"  height="15" onload="SetRating(this,{$hotel.rating});" />
                        </td>

                    </tr>
                </table>
            </div>

            <div class="hotels" id="hotels{$hotel.id}" style="display:none;">
                {$hotel.propertyDetails}
                <strong>Checkin Instructions</strong><br>
                {$hotel.hotelPolicy}
            </div>

            <div class="rooms" id="rooms{$hotel.id}" style="display:none;">
                {foreach $hotel.roomTypes as $roomType}
                    <div style="padding:5px;">
                        <div style="border: 1px solid #000000; padding: 5px;">
                            {if $roomType.cancelPolicy != ""}
                                <div>


                                    <span style="font-weight:bold; font-size: 20px;"> {$roomType.description}</span>
                                    <span   style="padding:10px;">
                                        <strong style="color:#000;">
                                            {$roomType.averageRate}{$hotel.rateCurrencyCode}
                                        </strong>
                                    </span>
                                    <span   style="padding:10px;">
                                        {if $roomType.nonRefundable==1}
                                            <label style="color:red;"><strong> NON-REFUNDABLE</strong></label>
                                        {else}
                                            <label style="color:blue;">
                                                <strong> REFUNDABLE</strong>
                                            </label>
                                        {/if}
                                    </span>
                                    <span id="book_span">                   

                                        <h3 class="right" style="padding-right:20px;">

                                            <form method="post" action="bookingPage.php">

                                                {* Used for telling the login page that the user was sent from this page*}
                                                <input name="currentPage"           type="hidden" value="{$server}">

                                                {* Original POST fields - pass on POST values*}
                                                <input name="hotelId"               type="hidden" value="{$hotel.hotelId}"/>
                                                <input name="supplierType"          type="hidden" value="{$hotel.supplierType}"/>
                                                <input name="roomRateKey"           type="hidden" value="{$hotel.roomRateKey}"/>
                                                <input name="roomRateCode"          type="hidden" value="{$hotel.roomRateCode}"/>
                                                <input name="roomTypeCode"          type="hidden" value="{$hotel.roomTypeCode}"/>
                                                <input name="hotelImage"            type="hidden" value="{$hotel.thumbnailUrl}"/>
                                                <input name="hotelName"             type="hidden" value="{$hotel.hotelName}"/>
                                                <input name="roomDescription"       type="hidden" value="{$roomType.description}"/>
                                                <input name="averageRate"           type="hidden" value="{$roomType.averageRate}"/>
                                                <input name="total"                 type="hidden" value="{$roomType.total}"/>
                                                <input name="roomtotal"             type="hidden" value="{$hotel.rateInfos.total}"/>
                                                <input name="nightlyRateTotal"      type="hidden" value="{$hotel.rateInfos.nightlyRateTotal}"/>
                                                <input name="surchargeTotal"        type="hidden" value="{$hotel.rateInfos.surchargeTotal}"/>
                                                <input name="currencyCode"          type="hidden" value="{$hotel.rateInfos.currencyCode}"/>

                                                <input value="Book now" id="search_button" type="submit" onclick=""></input>
                                            </form>
                                        </h3>
                                    </span>
                                    <div> {$roomType.descriptionLong} </div>
                                    <div style="background-image: url(../images/templatemo_middle.jpg); color:#fff;padding:5px;">
                                        <div id="hotel_cancelation_policy{$hotel.id}" class="hotel_options">
                                            <label class="link" onclick="showCancelationPolicy('cancelationPolicy{$hotel.id}{$roomType.roomId}')" >
                                                Cancellation policy
                                            </label>
                                        </div>

                                        <div id="cancelationPolicy{$hotel.id}{$roomType.roomId}" style="display:none;">
                                            <div style="padding:10px;">
                                                {$roomType.cancelPolicy}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <br />
                            {/if}
                        </div>
                    </div>
                {/foreach}
            </div>

            <div class="galery"  id="galery{$hotel.id}" style="display:none;">

                <!--
                                <img src="{$image.url}" style="{$image.style}" {$image.width_p} {$image.height_p}  />
                
                
                            <img src={$image.url} />
                -->
                <div id="galery_panel" >
                    <div id="picture_panel">
                        <div id="picture_frame" align="center">
                            {foreach $hotel.hotelImages as $image}
                                {$ok=1}
                                {if $ok==1}
                                    <img src={$image.url} style="block"  id="picture{$hotel.id}{$image.nr_picture}" />
                                    {$ok=0}
                                {else}
                                    <img src={$image.url} style="none"  id="picture{$hotel.id}{$image.nr_picture}" />
                                {/if}
                            {/foreach}
                        </div>
                    </div>
                    <div id="tumbnails_panel">
                        <div id="tumbnails_frame" align="center">
                            {foreach $hotel.hotelImages as $image}
                                <label onclick="show_picture({$image.nr_picture},{$hotel.id})">
                                    <img src={$image.thumbUrl} width="50" height="40" />
                                </label>
                            {/foreach}
                        </div>
                        <div id="photos_disclaimer">

                            <div id="disclaimer_content" style="padding:5px;">
                                Note: It is the responsibility of the hotel chain and/or the individual property to ensure the accuracy of the photos displayed. We are not responsible for any inaccuracies in the photos.
                            </div>
                        </div>
                    </div>

                </div>


            </div>

        </div>
    </div>



</div>

</div>


</div>

{/foreach}

